<template>
	<view class="wrap" :class='APPTheme'>
		<view class="top"></view>
		<view class="content">
			<view class="title">欢迎登录量子办公助手</view>
			<view class="input-title">手机号码：</view>
			<input class="u-border-bottom" type="number" v-model="loginName" placeholder="请输入手机号" focus/>
			<view class="tips" >未注册的手机号需联系管理员创建</view>
			<wButton text="获取短信验证码" :rotate="isRotate"  bgColor="linear-gradient(to right, rgba(10,177,87,0.7), rgba(50,135,200,0.6))" @click.native="submit()" class="getCaptcha"></wButton>
			<view class="alternative">
				<view class="password" @click="passwordLogin">密码登录</view>
				<view class="issue" @click="seaveFn">注册</view>
			</view>
		</view>
		<view class="buttom">
			<!-- <view class="loginType">
				<view class="wechat item">
					<view class="icon"><uni-icons size="40" type="weixin" color="rgb(83,194,64)"></uni-icons></view>
					微信
				</view>
				<view class="QQ item">
					<view class="icon"><uni-icons size="40" type="qq" color="rgb(17,183,233)"></uni-icons></view>
					QQ
				</view>
			</view> -->
			<view class="hint">
				<checkbox-group @change="checkboxChange">
					<label class="checkbox">
						<checkbox value="用户协议" :checked="user_agreement" />
						登陆即代表阅读并同意
						<navigator url="../agreement/agreement" style="display: inline-block;"><text class="link">用户隐私声明</text></navigator>
					</label>
				</checkbox-group>
			</view>
		</view>
	</view>
</template>

<script>
let that
import {mapGetters,mapActions} from 'vuex'
import wButton from '@/components/watch-login/watch-button.vue' //button
export default {
	components:{
		wButton
	},
	data() {
		return {
			user_agreement:false,
			loginName: '',
			isRotate: false, //是否加载旋转
		}
	},
	computed: {
		...mapGetters(['APPTheme','userInfo','api']),
		inputStyle() {
			let style = {};
			if(that.loginName) {
				style.color = "#fff";
				style.backgroundColor = that.$lizhao.color['warning'];
			}
			return style;
		},
	},
	onLoad() {
		that=this
	},
	methods: {
		getFn(){
			let req={
				loginName :'',
				password:123456,
				code:'',
				// sessionId:''
			}
			that.GLOBAL.doPost(that.api.GLOBAL_login,{}).then(res=>{
				console.log(res)
			})
		},
		submit() {
			if(that.$lizhao.test.mobile(that.loginName)) {
				if(!that.user_agreement){
					uni.showToast({
						title: '请勾选用户协议',
						icon:"none"
					});
					return
				}
				
				let req={
					phone:that.loginName,
				}
				that.GLOBAL.doGet(that.api.GLOBAL_admin_getMessage,req).then(res=>{
					if(res.data&&res.data.flag){
						uni.navigateTo({
							url: '/pages/template/login/code?loginName='+that.loginName,
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
					}else{
						uni.showToast({
							title: res.data.msg,
							icon:"none"
						});
					}
				})
			}else{
				if(that.loginName){
					uni.showToast({
						title: '手机格式不正确',
						icon:"none"
					});
				}else{
					uni.showToast({
						title: '请填写手机号码',
						icon:"none"
					});
				}
				
			}
		},
		checkboxChange(e) {
			if (e.detail.value[0] == '用户协议') {
				that.user_agreement = true;
			} else {
				that.user_agreement = false;
			}
		},
		//密码登陆
		passwordLogin(){
			uni.navigateTo({
				url: './passwordLogin',
				success: res => {},
				fail: () => {},
				complete: () => {}
			});
		},
		//注册
		seaveFn(){
			uni.navigateTo({
				url: '../register/register',
			});
		}
	}
};
</script>

<style lang="scss" scoped>
@import './login.scss';
</style>
